import { useEffect, useState } from "react";

export function useMatchMedia(query: string) {
  const [mediaQuery] = useState(() => matchMedia(query));
  const [match, setMatch] = useState(mediaQuery.matches);

  useEffect(() => {
    mediaQuery.addEventListener("change", function () {
      setMatch(this.matches);
    });
  }, []);

  return match;
}
